<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>安工院组织机构-人员</title>
    <#include "../../commonFile/quote.ftl"/>
    <script>
        //全局变量anyOrgUser（安工院组织机构与人员信息）
        var anyOrgUser = {};
        //组织机构ID
        anyOrgUser.orgId;
        //初始化表格
        anyOrgUser.tableInit = function(){
            $("#agyOrgUserTable").bootstrapTable({
                url:'/systemAgyOrgUser/agyUserInfo',  //获取表格数据
                contentType:'application/x-www-form-urlencoded; charset=UTF-8',//使用post传参，去掉后无法成功
                method: "post",
                toolbar:"#agyOrgUserToolbar",
                cache: false,            //禁用ajax缓存
                striped: true,           //表格显示条纹
                pagination: true,        //在底部显示分页组件
                pageList: [10, 20],       //设置页面可以显示的数据条数
                pageSize: 10,             // 页面数据条数
                pageNumber: 1,            // 首页页码
                sidePagination: 'server', // 设置为服务器端分页
                showColumns:true,        //是否显示内容列下拉框
                showToggle:true,         //切换详细视图和列表视图
                queryParamsType: '',
                queryParams:anyOrgUser.queryParams,
                idField:'id',             //指定主键列
                columns:[
                {
                    checkbox: true,   //显示一个勾选框
                    align: 'center'   //居中显示
                },
                {
                    field:'account',  //返回json中的name
                    title:'域账号',   //表格表头显示文字
                    align:'center',   //左右居中
                    valign: 'middle' // 上下居中
                },
                {
                    field:'name',  //返回json中的name
                    title:'姓名',   //表格表头显示文字
                    align:'center',   //左右居中
                    valign: 'middle' // 上下居中
                },
                {
                    field:'sex',
                    title:'性别',
                    align:'center',
                    valign: 'middle',
                    formatter: function (value, row, index) {
                        if(value=="1"){
                            value = "男";
                        };
                        if(value=="0"){
                            value = "女";
                        };
                        return value;
                    }
                },
                {
                    field:'post',
                    title:'职位',
                    align:'center',
                    valign: 'middle',
                },
                {
                    field:'mobile',
                    title:'手机号',
                    align:'center',
                    valign: 'middle'
                },
                {
                    field:'email',
                    title:'邮箱',
                    align:'center',
                    valign: 'middle'
                }
                ]
            });
        };
        //表格传参的方法
        anyOrgUser.queryParams = function (params){   //请求服务器数据时，添加额外参数
            var temp = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                pageSize:params.pageSize, // 每页要显示的数据条数
                pageNum:params.pageNumber,    // 页码
                searchName:$("#searchName").val(),
                orgId:anyOrgUser.orgId
            };
            return temp;
        };
        //查询按钮点击事件
        anyOrgUser.searchSysorgs = function () {
            $("#agyOrgUserTable").bootstrapTable("refresh",{silent: true})
        };
        //文档就绪事件
        $(function () {
            $.ajax({
                type: 'post',
                url: '/systemAgyOrgUser/agyOrganiseInfo',
                async: false,
                dataType: 'json',
                success: function (result) {
                    //初始化treeView
                    $('#tree').treeview({
                        highlightSelected: true,//当选择节点时是否高亮显示。
                        showBorder: true,//是否在节点上显示边框。
                        showImage: true,
                        showIcon:true,
                        data: result.data,
                        onNodeSelected: function (event, data) {
                            debugger
                            anyOrgUser.orgId=data.id;
                            $("#agyOrgUserTable").bootstrapTable("refresh",{silent: true});
                        }
                    });
                }
            });
            anyOrgUser.tableInit();
        });
    </script>
</head>
<body>
<div class="container-fluid">
    <div class="row" style="display: flex">
        <div class="col-xs-3">
            <div style="width: 99%;height: 100%;" id="tree"></div>
        </div>
        <!--组织机构表格-->
        <div class="col-xs-9">
            <table id="agyOrgUserTable" class="table  table-striped table-bordered table-hover"></table>
            <div id="agyOrgUserToolbar" class="toolbar" role="toolbar">
                <form class="form-inline" role="form">
                    <div class="form-group">
                        <label class="xs-only" for="searchName">名称：</label>
                        <input type="text" class="form-control input-sm" id="searchName" placeholder="请输入名称">
                    </div>
                    <button class="btn btn-default btn-sm" type="button" onclick="anyOrgUser.searchSysorgs()">查询</button>
                </form>
            </div>
        </div>
    </div>
</div>
</body>
</html>